<html>
	<head>
	<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
	
	<script type="text/javascript">
	
	
		$(document).ready(function(){
				
		
			$(".copylink").click(function(){
				var action = "copylink"
				var params = {
					"link_key" : document.getElementById("copy_link_key").value,
					"target_folder_key" : document.getElementById("copy_dest_folder_key").value	
				}
				
				
				$.post("link",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			alert(data)
      			}); 
      			 
			});
			
			
			
						
			
			$(".movelink").click(function(){
				var action = "movelink"
				var params = {
					"link_key" : document.getElementById("move_link_key").value,
					"target_folder_key" : document.getElementById("move_dest_folder_key").value	
				}
				
				
				$.post("link",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			alert(data)
      			}); 
      			 
			});
			
			
			
			
			
			$(".updatelink").click(function(){
				var action = "updatelink"
				var params = {
					"link_key" : document.getElementById("update_link_key").value,
					"url" : document.getElementById("update_link_url").value	
				}
				
				
				$.post("link",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			alert(data)
      			});
      			 
			});


			
			
			
			
			
			
			
			
			
			$(".deletelink").click(function(){
				var action = "deletelink"
				var params = {
					"link_key" : document.getElementById("delete_link_key").value
				}
				
				$.post("link",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			alert(data)
      			});
      			 
			});








			$(".addlink").click(function(){
				var action = "addlink"
				var params = {
					"url" : document.getElementById("link_url").value,
					"parent" : document.getElementById("parent_folder").value,
				}
				
				$.post("link",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      				alert(data)
      			});
	      			 
			});
		
		
		
			$(".updatefolder").click(function(){
				var action = "updatefolder"
				var params = {
					"folder_key" : document.getElementById("update_folder_key").value,
					"new_name" : document.getElementById("update_folder_name").value
				}
				
				$.post("folder",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      				alert(data)
      			});
	      			 
			});
			
			
		
		
			$(".addfolder").click(function(){
				var action = "addfolder"
				var params = {
					"parent_folder_key" : this.parentNode.id,
					"name" : document.getElementById("folder_name").value,
					"view" : "Default",
					"icon" : "Default",
					"color" : "Defaut",
					"path" : "default",					
				}
				
				$.post("folder",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			});
      			 
			});
			
			
			
			$(".viewfolder").click(function(){
				var action = "viewfolder"
				var params = {
					"folder_key" : this.parentNode.id,
				}
				
				$.post("folder",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			
      				folder_objs = JSON.parse(data)
      				var txt=""
      				for (i in folder_objs)
					{
						if (i=="folder")
						{
							for (j in folder_objs[i])
					        	{
					          		txt = txt+"Folder: " + folder_objs[i][j].name + ",  Key: " + folder_objs[i][j].key + "<br>" 
					        	}
					   	}
					   	else if (i=="link")
					   	{
					   		for (j in folder_objs[i])
					        	{
					          		txt = txt+"Link: " + folder_objs[i][j].url + ",  Key: " + folder_objs[i][j].key +  "<br>" 
					        	}
					   	}
					   	
					} 
      			      
      			      				
      				document.getElementById("foldercontainer").innerHTML = txt
      			
      			});
				
			});
			
			
			$(".deletefolder").click(function(){
				var action = "deletefolder"
				var params = {
					"folder_key" : document.getElementById("delete_folder_key").value
				}
				
				
				
				$.post("folder",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			alert(data)
      			});
      			 
			});
			
			
			
			
			$(".movefolder").click(function(){
				var action = "movefolder"
				var params = {
					"folder_key" : document.getElementById("move_folder_key").value,
					"target_folder_key" : document.getElementById("move_folder_to").value
				}
				

				
				$.post("folder",{
      				action : action,
       				params : JSON.stringify(params)
      			},
      			function(data,status){
      			alert(data)
      			});
     			 
			});
			
			
			
			
			
			
		});
		
	</script>
	
		
	</head>
	<body>
	
		<h2>{{message}}</h2>
		<br>
		<div class="r1">
			<div class="logo">Logo</div>
			<div class="path">Path: {{path}}</div>
			<div class="addbutton">
				<button class="addbutton" id=addurl>Add</button>
			</div>
		</div>
		<hr>
		<div class="r2">
			<div class="r2-c1">
				<div class="folderselector">
					<div class = "sysfolder" id="{{folder_links.key.urlsafe()}}" name="mydrive">
						mydrive :
						<button class="addfolder">Add Folder</button>
						<button class="viewfolder">View Folder</button>
						n_items: {{folder_links.n_items}}, 
						key: {{folder_mydrive.key.urlsafe()}}, 
					</div>
				</div>
				<div class="folderselector">
					<div class = "sysfolder" id="{{folder_videos.key.urlsafe()}}">
						videos  :
						<button class="addfolder">Add Folder</button>
						<button class="viewfolder">View Folder</button>
						n_items: {{folder_videos.n_items}}, 
						key: {{folder_videos.key.urlsafe()}}
					</div>
				</div>
				<div class="folderselector">
					<div class = "sysfolder" id="{{folder_articles.key.urlsafe()}}">
						articles :
						<button class="addfolder">Add Folder</button>
						<button class="viewfolder">View Folder</button>
						n_items: {{folder_articles.n_items}}, 
						key: {{folder_articles.key.urlsafe()}}
					</div>
				</div>
				<div class="folderselector">
					<div class = "sysfolder" id="{{folder_images.key.urlsafe()}}">
						images :
						<button class="addfolder">Add Folder</button>
						<button class="viewfolder">View Folder</button>
						n_items: {{folder_images.n_items}}, 
						key: {{folder_images.key.urlsafe()}}
					</div>
				</div>
				<div class="folderselector">
					<div class = "sysfolder" id="{{folder_apps.key.urlsafe()}}">
						apps :
						<button class="addfolder">Add Folder</button>
						<button class="viewfolder">View Folder</button>
						n_items: {{folder_apps.n_items}}, 
						key: {{folder_apps.key.urlsafe()}}
					</div>
				</div>
				<input type="text" id="folder_name">
			</div>
			<hr>
			<div class="r2-c2">
				<div id="foldercontainer">folder1</div>
			</div>
			
			
			
			<br><hr>
			
			Copy Link<br>
			Link Key <input type="text" id="copy_link_key"><br>
			Destination Folder <input type="text" id="copy_dest_folder_key"><br>
			<button class="copylink">Copy Link</button><br>
			<br>
			
			
			Move Link<br>
			Link Key <input type="text" id="move_link_key"><br>
			Destination Folder <input type="text" id="move_dest_folder_key"><br>
			<button class="movelink">Move Link</button><br>
			<br>
			
			Update Link<br>
			Link Key<input type="text" id="update_link_key"><br>
			New URL<input type="text" id="update_link_url"><br>
			<button class="updatelink">Update Link</button><br>
			<br>
			
			Delete Link<br>
			<input type="text" id="delete_link_key"><br>
			<button class="deletelink">Delete Link</button><br>
			<br>
			
			Add Link<br>
			URL: <input type="text" id="link_url"><br>
			Parent Folder: <input type="text" id="parent_folder"><br>
			<button class="addlink">Save</button><br>
			<br>
			
			Delete Folder<br>
			<input type="text" id="delete_folder_key"><br>
			<button class="deletefolder">Delete Folder</button><br>
			<br>
			
			move folder<br>
			Folder: <input type="text" id="move_folder_key"><br>
			Move to: <input type="text" id="move_folder_to"><br>
			<button class="movefolder">Move</button><br>
			<br>
			
			udpate folder<br>
			Folder: <input type="text" id="update_folder_key"><br>
			Name: <input type="text" id="update_folder_name"><br>
			<button class="updatefolder">Update</button>
			
			
			
			
			<hr>
			<div class="r2-c3">
				<div id="itemname">name:</div>
				<div id="datecreated">created:</div>
				<div id="datemodified">modified:</div>
				<div id="path">path:</div>
			</div>
		</div>	
		<hr>
		<div class="r3">
			<div class="window">Window1</div>
		</div>
		<br>
	
		<hr>
		<a href={{logout_url}}>Logout</a>
		
		
	</body>
</html>